<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div id="app"></div>
<script src="../packages/runtime-dom/dist/runtime-dom.global.js"></script>
<script type="module">

    let {createApp, h, reactive, onMounted, onBeforeMount, onUpdated, onBeforeUpdate} = VueRuntimeDom

    let app = {
        setup() {
            let state = reactive({num:0})
            onBeforeMount(() => {
                console.log("加载之前")
            })
            onMounted(() => {
                console.log("加载之后")
            })
            onBeforeUpdate(() => {
                console.log("数据更新之前")
            })
            onUpdated(() => {
                console.log("数据更新完成")
            })

            setTimeout(() => {
                state.num++
            }, 1000)

            return {
                state
            }
        }
    }

    createApp(app).mount('#app')


</script>
</body>
</html>